<template>
  <div class="books">
    <el-row :gutter="20">
      <el-col :span="24">

        <el-table
            :data="tableData"
            style="width: 100%">
          <el-table-column
              prop="borrow_id"
              label="借阅编号"
              width="100">
          </el-table-column>
          <el-table-column
            prop="bid"
            label="图书编号"
            width="100">
          </el-table-column>
          <el-table-column
              prop="name"
              label="书名"
              width="180">
          </el-table-column>
          <el-table-column
              prop="b_time"
              label="借书时间"
              width="100">
          </el-table-column>
          <el-table-column
              prop="state"
              label="状态"
              width="100">
          </el-table-column>
          <el-table-column label="操作" width="180">
            <template slot-scope="scope">
              <el-button
                  size="mini"
                  @click="returnBook(scope.row)">还书
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
      <el-col :span="12">
      </el-col>
    </el-row>
  </div>
</template>
<script>


import {getBorrowList, returnBook} from "@/api/app";

export default {
  name: 'MyBooksView',
  inject: ['commonData'],
  data() {
    return {
      uid:this.commonData.uid,
      role:this.commonData.role,

      tableData: [{}],
      formInline: {
        bookname: ''
      }
    }
  },
  methods: {
    getPage() {
      getBorrowList(this.formInline).then(res => {
        console.log(res)
        this.tableData = res.data.records
      })
    },
    returnBook(row) {
      console.log(row)
      returnBook(row).then(() => {
        this.getPage()
      })

    },
  },
  created() {
    this.getPage()
  }
}
</script>